不論是設計師在上機繪製前、工程師在實作開發前，都需要先完成設計、規劃好Spec，才能在製作上更加順利。因此，在開始做實作 Web Motion 前，需先從 Motion Graphic 設計與規劃開始，而 Motion Graphic 基本上有以下四點流程：

• 概念發想
• 分鏡草稿與動態腳本
• 彩色分鏡稿
• 動態製作

一、概念發想

概念發想的訂定是賦予作品靈魂的重要步驟，決定作品主題與後續走向。
基本上都會從觀摩作品開始進行靈感發想，像是 Behence、Pinterest 平台都能利用關鍵字找到很多設計師的作品(當然也能利用強大的Google搜尋！)，透過觀察這些作品、分析時間軸上的畫面變化，進行發想構思，決定作品概念方向後，就能開始設計畫面與動態囉！

二、分鏡草稿與動態腳本

Motion Graphic 是帶入時間軸概念的設計，把每一個畫面依照時間安排串接起來，因此分鏡腳本就是要進行畫面的安排與設計。在開始製作概念草稿時，建議把滑鼠放掉、拿起紙筆來畫畫吧！排除工具與技術的限制，才能避免受到工具的使用限制而阻礙想法的落實。這裡不用擔心美醜問題，在草稿階段就是利用線條去繪製圖像，能夠把停留在腦袋裡的概念清楚呈現，除了能確認概念的可行性外，才能更好的開展後續流程。

大略規劃好分鏡後，就可以開始進行動態腳本的規劃。動態腳本通常是把剛剛分鏡的草圖加上時間軸，把畫面轉換的設計移併納入進來，構思如何從A轉換到B，是利用控制透明度進行淡入淡出變化？利用位移變化產生A離開與B進入？或是大小變化讓A縮小消失、B放大出現？

不同的效果會產生不同的感覺，就看作者希望用哪種方式呈現囉！
備註：若需要更精細完整的動態腳本，這邊也可以使用軟體製作。

三、彩色分鏡稿 & 四、動態製作

分鏡與動態腳本都規劃完成後，就可以開始著手進行畫面與元件繪製，最後加入時間元素，進行動態效果製作。

以上是 Motion Graphic 的基本流程，依照設計團隊、設計師的習慣與需求會拓展出更多細節，下一篇會介紹基本的動態效果，透過這些動態特效與時間不同組合，就能製作出多種不同感覺的作品。